<template>
  <div>
    <my-head :title="$route.query.name"></my-head>
    <van-swipe :autoplay="3000">
      <van-swipe-item v-for="(l, i) in imgs" :key="i">
        <img :src="l" alt="" />
      </van-swipe-item>
    </van-swipe>

    <div class="title">
      <p>全款￥{{ good.maxPrice }}</p>
      <h2>{{ good.name }}</h2>
    </div>
    <van-cell-group class="goodinfo">
      <van-cell title="商品单价" :value="good.maxPrice + '元'" />
      <van-cell title="购买数量">
        <template #default>
          <van-stepper @change="changevalue" v-model.number="value" min="1" />
        </template>
        <van-cell
          title="购买小计"
          :value="(good.maxPrice * value).toFixed(2) + '元'"
        />
      </van-cell>
    </van-cell-group>
  </div>
</template>

<script>
export default {
  data() {
    return {
      good: [],
      imgs: [],
      value: 1,
    };
  },
  methods: {
    async getGoodOne() {
      let res = await this.$ajax.getGoodinfo({
        itemsId: this.$route.params.gid,
      });
      this.good = res.data;
      this.imgs = res.data.img;
      // console.log(this.good);
      // console.log(this.imgs);
    },
  },
  mounted() {
    this.getGoodOne();
    console.log(this.$route.params.gid);
  },
};
</script>

<style lang="scss" scoped>
img {
  width: 100%;
  height: 100%;
}
</style>